<!DOCTYPE html>
<html ng-app="orderInfo">

<head>
    <meta charset="utf-8"></meta>
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=0"></meta>

    <title>订单详情</title>

    <link href="/static/AmazeUI-2.4.2/assets/css/admin.css" rel="stylesheet" type="text/css"></link>
    <link href="/static/AmazeUI-2.4.2/assets/css/amazeui.css" rel="stylesheet" type="text/css"></link>

    <link href="/static/css/personal.css" rel="stylesheet" type="text/css"></link>
    <link href="/static/css/orstyle.css" rel="stylesheet" type="text/css"></link>
    <script type="text/javascript" src="/static/js/angular.js"></script>

</head>

<body>
<head th:include="header"/>
<div class="center">
    <div class="col-main">
        <div class="">
            <div class="user-orderinfo" ng-controller="orderInfo">
                <span id="orderId" th:text="${orderId}" hidden="hidden"></span>
                <span hidden="hidden">{{flag}}</span>
                <!--标题 -->
                <div class="am-cf am-padding">
                    <div class="am-fl am-cf"><strong class="am-text-danger am-text-lg">订单详情</strong> /
                        <small>Order&nbsp;details</small>
                    </div>
                </div>
                <!--进度条-->

                <div class="order-infomain">

                    <div class="order-top">
                        <div class="th th-item">
                            <td class="td-inner">商品</td>
                        </div>
                        <div class="th th-price">
                            <td class="td-inner">单价</td>
                        </div>
                        <div class="th th-number">
                            <td class="td-inner">数量</td>
                        </div>
                        <div class="th th-operation">
                            <td class="td-inner">&nbsp;&nbsp;&nbsp;&nbsp;</td>
                        </div>
                        <div class="th th-amount">
                            <td class="td-inner">合计</td>
                        </div>
                        <div class="th th-status">
                            <td class="td-inner">交易状态</td>
                        </div>
                        <div class="th th-change">
                            <td class="td-inner">交易操作</td>
                        </div>
                    </div>

                    <div class="order-main">
                        <div class="order-status3">
                            <div class="order-title">
                                <div class="dd-num">订单编号：<a href="javascript:;" th:text="${orderId}"></a></div>
                                <span>下单时间：{{order.createTime}}</span>
                                <span style="padding-left: 100px;" ng-show="showDealTime(order.dealTime)">成交时间：{{order.dealTime}}</span>
                            </div>
                            <div class="order-content">
                                <div class="order-left">
                                    <ul class="item-list" ng-repeat="oItem in order.orderItems">
                                        <li class="td td-item">
                                            <div class="item-pic">
                                                <a href="#" class="J_MakePoint">
                                                    <img src="/static/images/kouhong.jpg_80x80.jpg"
                                                         class="itempic J_ItemImg"/>
                                                </a>
                                            </div>
                                            <div class="item-info">
                                                <div class="item-basic-info">
                                                    <a href="#">
                                                        <p>{{oItem.itemName}}</p>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>
                                        <li class="td td-price">
                                            <div class="item-price">
                                                {{oItem.itemPrice}}
                                            </div>
                                        </li>
                                        <li class="td td-number">
                                            <div class="item-number">
                                                <span>×</span>{{oItem.itemNums}}
                                            </div>
                                        </li>
                                        <li class="td td-operation">
                                            <div class="item-operation">

                                            </div>
                                        </li>
                                    </ul>
                                </div>
                                <div class="order-right">
                                    <li class="td td-amount">
                                        <div class="item-amount">
                                            合计：{{order.amout}}
                                        </div>
                                    </li>
                                    <div class="move-right">
                                        <li class="td td-status">
                                            <div class="item-status">
                                                <p class="Mystatus" ng-bind="setStauts(order.stauts)"></p>
                                            </div>
                                        </li>
                                        <li class="td td-change">
                                            <div class="am-btn am-btn-danger anniu" ng-bind="setChange(order.stauts)"
                                                 ng-click="changeStauts(order.orderId,order.stauts)">
                                            </div>
                                        </li>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/javascript">

    var app = angular.module("orderInfo", []);

    app.controller("orderInfo", function ($scope, $http) {
        var orderId = document.getElementById("orderId").innerHTML;
        $http.get("/order/" + orderId).success(function (response) {
            $scope.order = response.data;
        });

        $scope.setStauts = function (stauts) {
            if (stauts == 1)
                return "未支付";
            if (stauts == 2)
                return "未发货";
            if (stauts == 3)
                return "已发货";
            if (stauts == 4)
                return "交易成功";
            if (stauts == 5)
                return "交易关闭";
        }

        $scope.setChange = function (stauts) {
            if (stauts == 1)
                return "一键付款";
            if (stauts == 2)
                return "提醒发货";
            if (stauts == 3)
                return "确认收货";
            if (stauts == 4)
                return "删除订单";
            if (stauts == 5)
                return "交易关闭";
        }

        $scope.showDealTime = function (dealTime) {
            console.log(dealTime);
            if (dealTime == null || dealTime == undefined || dealTime == "") {
                return false;
            } else
                return true;
        }

        $scope.flag = false;
        $scope.changeStauts = function (orderId, stauts) {

            if (stauts == 5)
                return;
            var flag = $scope.flag;
            console.log(flag)
            if (stauts == 2) {
                if (flag == true)
                    alert("已经提醒过了!");
            }

            $http({
                url: '/order',
                method: 'put',

                params: {
                    orderId: orderId,
                    stauts: stauts
                },
            }).success(function (res) {
                console.log(res)
                if (res.message == 2) {
                    $scope.flag = true;
                    return;
                }
                window.location.reload();
            })
        }
    })

</script>
</html>